import React from 'react'
import { Button, Input, Select } from 'antd'

interface Props {
  isTalk: boolean
  isLarge: string
  isHoverChat: boolean
  isHoverAnswers: boolean
  isVoice: boolean
  vioceText: string
  toggleTalk: () => void
  toggle: () => void
  handleChat: () => void
  handleChat1: () => void
  handleAnswers: () => void
  handleTextChange: (e: React.ChangeEvent<HTMLInputElement>) => void
  handleAnswers1: () => void
  toggleVoice: () => void
  textAi: (e: React.KeyboardEvent<HTMLInputElement>) => void
  handleLarge: (value: string) => void
}

const Index: React.FC<Props> = ({
  isTalk,
  toggleTalk,
  handleLarge,
  isLarge,
  toggle,
  isHoverChat,
  handleChat,
  handleChat1,
  isHoverAnswers,
  handleAnswers,
  handleAnswers1,
  toggleVoice,
  handleTextChange,
  isVoice,
  textAi,
  vioceText
}) => {
  return (
    <footer>
      {isVoice ? (
        <div
          className={`container ${isTalk ? 'talk1' : 'talk2'} center`}
          onClick={toggleTalk}
        ></div>
      ) : (
        <div className={`container center inp`}>
          <Input
            type="text"
            placeholder="请输入内容"
            value={vioceText}
            onKeyDown={textAi}
            onChange={handleTextChange}
          />
        </div>
      )}
      <Button type="primary" className="btn" onClick={toggleVoice}>
        {isVoice ? '文字' : '语音'}
      </Button>
      <Select
        defaultValue={isLarge}
        style={{ width: 120 }}
        onChange={handleLarge}
        options={[
          { value: '1', label: '星火大模型' },
          { value: '2', label: '千帆大模型' }
        ]}
      />
      <div className="right" onClick={toggle}></div>
      <div
        className={`container ${isHoverChat ? 'image1' : 'image2'} right chat`}
        onMouseOver={handleChat}
        onMouseOut={handleChat1}
      ></div>
      <div
        className={`container ${isHoverAnswers ? 'image1' : 'image2'} right answers`}
        onMouseOver={handleAnswers}
        onMouseOut={handleAnswers1}
      ></div>
    </footer>
  )
}

export default Index
